<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>表单</title>
</head>
<body>
    <h1>什么是表单？</h1>
    具有交互属性
    <br>
    比如登录页，搜索页
    <hr>
    百度搜索
    <form action="https://www.baidu.com/s" target="_blank">
        <input type="text" name="wd">
        <button>搜索</button>
    </form>
    <br>
    bilibili搜索
    <form action="https://search.bilibili.com/all" target="_blank">
        <input type="text" name="keyword">
        <button>比比汗丽丽搜索</button>
    </form>
    <hr>
    <strong>注意</strong>
    还有一个标签method方法，默认是get，但是post是后端的，不能乱用
    <hr>
    <h1>表单控件</h1>
    <h2>写一个注册表单</h2>
    <form action="https://search.bilibili.com/all" target="_blank">
        账户：<input type="text" name="account" value="默认账户" maxlength="12"><br>
        密码：<input type="password" name="pwd" value="这是一段密码" maxlength="16"><br>
        性别：
        <input type="radio" name="gender" value="male" >男 
        <input type="radio" name="gender" value="female" >女<br>
        爱好：
        <input type="checkbox" name="hobbies" value="smoking" >抽烟
        <input type="checkbox" name="hobbies" value="drink">喝酒
        <input type="checkbox" name="hobbies" value="perm" checked>烫头<br>
        <!-- 隐藏域,现在多用于防爬 -->
        <input type="hidden" name="from" value="Jielin">
        

        <!-- 文本域 -->
        其他：<br>
         <textarea name="other" cols="30" rows="2"></textarea>
         <br>

        籍贯：
        <select name="place" >
            <option value="粤">广东省</option>
            <option value="赣">江西省</option>
            <option value="黑" disabled selected>黑龙江省</option>
            <option value="疗">辽宁省</option>
            <option value="闽">福建省</option>
        </select>
        <br>

        <!-- 确认按钮第一种 type默认提交-->
        <!-- <button>确认</button> -->
        <!-- 确认的第二终 -->
        <input type="submit" value="确认">
        <!-- 重置 -->
        <!-- <button type="reset">重置</button> -->
        <input type="reset" value="重选">

        <!-- 普通按钮：测试用户账户是否被注册 -->
        <button type="button">检测账户是否被注册</button>
        <input type="button" value="检测账户是否被注册">

        <!-- 禁用控件标签：disabled -->
    </form>
</body>
</html>